<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>显示与光标属性</title>
		<!-- 盒模型 由边框+外边距+内边距 -->
		<!-- 显示属性 display  none|block| inline
		 none 特点：去掉盒模型中元素
		 block 特点:将盒模型中元素改为块元素
		 inline 特点:将盒模型中元素改为行元素 
		 结论：没有所谓行转块、块转行！
		 -->
		<style>
			di v{
				
				width: 50px;
				height: 50px;
				border: 10px solid green;
				}
				
			div{
				/* 背景图片属性   500*500*/
				width: 500px;
				height: 500px;
				background: url(img/狼堡.jpg);inline
				background-size: 100%;
				/* 显示属性   display：none */
				dis play: none;
				/* 问题：为什么图片没了 
				转成行内元素，行内元素实际宽高由内容来定
				div----特点：有宽没高，没内容
				*/
			   
			   cursor: grabbing;
			}	
			/* 补充知识点：显示属性 */
			p{
				width: 500px;
				height: 460px;
				background: url(img/img_2.png);
				background-size: 100%;
				/* 元素隐藏，盒模型任然存在 */
				visi bility: hidden;
				/* 光标属性：通常修饰某些元素光标效果【属性值】 
				cursor光标属性: pointer指针   
				               crosshair十字准线
							   text     文本
							   wait     加载等待
							   help     帮助
							   grab     抓取
							   grabbing 抓取中（小拳头）
				*/
			   
			   cursor: pointer;
			}
		</style>
	</head>
	<body>
		<div></div>
		我一定会回来哒~
		<p></p>
		呔！妖精！还我师傅！
		
	</body>
</html>